<!-- 查询组件 -->
<template>
    <view class="search_contain">
        <view class="header">
            <Search @search="doSearch" />
        </view>
        <scroll-view @scrolltolower="handleScroll" scroll-y="true" style="height: 100vh;">
            <view v-for="(item, index) in formList" :key="index" class="box">
                <WaitItem :item="item" @cancel="reload" class="item" />
            </view>
        </scroll-view> 
    </view>
    <!-- <Authorize /> -->
</template>
    
<script setup lang='ts'>
import { computed, ref } from "vue";
import Search from "../../components/Search/index.vue";
import { OrderListType } from '@/type/index'
import { getByCustomer } from "@/@api/home";
import WaitItem from '@/components/WaitItem/index.vue'
import useUserStore from '@/store/user'
import useOrderStore from '@/store/order'
import Authorize from '@/components/Authorize/index.vue'
import { useDidShow,showLoading } from "@tarojs/taro";
import Taro from "@tarojs/taro";

const store = useUserStore()
const orderStore = useOrderStore()

const loading = ref(false)
const formList = ref<OrderListType[]>([])
const params = ref({
    pageNum: 1,
    pageSize: 10,
})

const query = ref({
    btcId: store.btsId,
    work: true,
    keywords: orderStore.keywords,
})


useDidShow(() => {
    params.value.pageNum = 1;
    formList.value = [];
    initList();
});

async function initList() {
    Taro.showLoading({
        title:"加载中"
    })
    const res: any = await getByCustomer(params.value, query.value)
    Taro.hideLoading()
    if (res.data.code == 200) {
        // list.value = setStatusVal([...list.value, ...res.data.rows])
        // formList.value = list.value.filter((item: OrderListType) => {
        //     return item.wxStatus != 1 && item.status != 1;
        // });
        formList.value = setStatusVal([...formList.value, ...res.data.rows])
        // 数据全部加载完成
        if (formList.value.length >= res.data.total) {
            loading.value = true;
        }
    }
}


function setStatusVal(obj: OrderListType[]): OrderListType[] {
    let arr = obj.map((item: OrderListType) => {
        let str = statusFilter(item.wxStatus, item.status, item.isExamine, item.billNo)
        return {
            ...item,
            statusVal: str
        }
    })
    return arr
}

function statusFilter(wxStatus: number, status: number, isExamine: number, billNo: string) {
    if (isExamine == 1 && wxStatus != 1 && billNo) {
        return "待审核";
    } else if (wxStatus == 2) {
        if ([4, 5, 6, 7].includes(status)) {
            return "待签收";
        } else {
            return "待支付";
        }
    } else if (wxStatus == 3) {
        return "未发货";
    } else if (wxStatus == 4) {
        return "运输中";
    } else if (wxStatus == 5) {
        return "待签收";
    } else if (wxStatus == 6) {
        return "已完成";
    } else {
        return "其他";
    }
}

const showList = computed(() => {
    return formList.value.filter(item => statusFilter(item.wxStatus,
        item.status,
        item.isExamine,
        item.billNo) != '其他')
})

function handleScroll() {
    if (!loading.value) {
        params.value.pageNum++;
        initList()
    }
}

// 搜索
function doSearch(val: string) {
    params.value.pageNum = 1;
    formList.value = [];
    loading.value = false;
    query.value.keywords = val
    initList()
}

</script>
    
<style lang="scss">
.search_contain {
    width: 100vw;
    height: 100vh;
    background-color: #efeff4;
    overflow: hidden;

    .header {
        height: 100rpx;
    }
    
    .scrollV{
        height: calc(100vh - 124rpx);
    }
    .search_list {
        height: calc(100vh - 124rpx);
        overflow: auto;
        padding: 0 24rpx;
        box-sizing: border-box;

        .item {
            width: 700rpx;
            // height: 312rpx;
            background-color: #fff;
            margin-top: 24rpx;
            border-radius: 10rpx;
            padding-top: 20rpx;
        }


    }
}
</style>